<template>
  <readonly-form :fields="dataFields.data" :data="data" />
</template>

<script>
import { reactive } from "vue";
import { handleFormEmptyData } from "@/tools/filters";
import { useI18n } from "vue-i18n";

export default {
  props: {
    data: {
      type: Object,
      default: () => ({}),
    },
  },
  setup(props, content) {
    const { t } = useI18n();
    const dataFields = reactive({
      data: [
        {
          title: t('ta-manage.label.detail'),
          fields: [
            { span: 6, title: t('ta-manage.label.phone'), field: "taPhone" },
            { span: 6, title: t('ta-manage.label.email'), field: "taEmail" },
            { span: 6, title: t('ta-manage.label.certificateType'), field: "taDocumentType" },
            { span: 6, title: t('ta-manage.label.idNumber'), field: "taCertificateNo" },
            { span: 6, title: t('ta-manage.label.responsibleForTheSubject'), field: "responsibleAccount" },
          ],
        },
        {
          title: t('ta-manage.title.attachmentInformation'),
          fields: [
            { span: 24, title: t('ta-manage.title.contract'), field: "contract" },
          ],
        },
      ],
    });

    return {
      t,
      dataFields,
      handleFormEmptyData,
    };
  },
};
</script>
